import {getMenuAndButtonList} from '@/api/user'
// 导入“cookie.js”工具
import {Key,PcCookie} from '@/utils/cookie'
// 定义状态
const state = {
    init: false, // ←注：左边这项的作用是“表示是否已加载用户权限信息”
    menuList:[], // ←注：左边这项被用于“表示当前用户所拥有的菜单权限”
    buttonList:[], // ←注：左边这项被用于“表示当前用户所拥有的按钮权限”
}
// 改变状态值
const mutations = {
    // “data”表示被传递过来的数据（即“response”中的“data”）
    // “SET_SYSTEM_MENU_AND_BUTTON”后面的冒号不能少（因为它引用了冒号后面的这个方法）↓
    SET_SYSTEM_MENU_AND_BUTTON: (state,data) => {
        state.init = true // ←注：左边这项表示“已经加载用户权限信息”
        state.menuList = data.menuTreeList // ←注：在左边这项中“data.”的后面是“menuTreeList”而不是“menuList”
        state.buttonList = data.buttonList
    }
}
// 定义行为（最主要的作用是调用接口）
const actions = {
    GetUserMenuAndButton({commit}) {
        return new Promise((resolve,reject) => {
            // 获取用户ID（注意：在后台响应的数据中，被用于表示“用户ID”的属性名称是“uid”）
            const userId = PcCookie.get(Key.userInfoKey) ? JSON.parse(PcCookie.get(Key.userInfoKey)).uid : null
            // 发送请求获取权限信息
            if (userId) {
                getMenuAndButtonList(userId).then(response => {
                    // 获取到了权限信息后将菜单和按钮数据保存到“vuex状态”中
                    commit('SET_SYSTEM_MENU_AND_BUTTON', response.data)
                    resolve() // ←注：左边这项表示“正常响应的钩子”
                }).catch(error => {
                    reject(error) // ←注：左边这项表示“异常响应的钩子”
                })
            }
        })
    }
}
export default {
    // 注：设置“namespaced: true”是为了解决不同模块命名冲突的问题。设置后，在使用（触发）模块中的mutations、getters、actions时，要加上模块名（格式为“模块（文件）名/（模块中的mutations/getters/actions的名称）”）（例如“menu/GetUserMenuAndButton”）↓
    namespaced: true,
    state, // ←注：左边这项相当于“ES5”中的“state:state”
    mutations, // ←注：左边这项相当于“ES5”中的“mutations:mutations”
    actions // ←注：左边这项相当于“ES5”中的“actions:actions”
}